// 左键点击动画
$(function(){
	var a_idx = 0;
	jQuery(document).ready(function($) {
	    $('body').click(function(e){   
			var font = ['F','A','N','G','J','I','E','S','O','N','G'];
	        var $i = $('<span/>').text(font[a_idx]); //新建span标签
			a_idx = (a_idx + 1) % font.length;
	        var x = e.pageX, y = e.pageY;//获取鼠标点击的坐标
	        $i.css({
	            'z-index':99999,
	            'top':y-20,
	            'left':x,
	            'position':'absolute',
	            'color':'#12A3EA',
				'font-weight':'700',
				'font-family':'hyllh'
	        });//给生成的span标签加上 样式
	        $('body').append($i);
	        $i.animate(
	            {'top':y-180,'opacity':0},
	            1500,
	            function(){
	            	$i.remove();
	            }
	        );//消失动画效果
	    });
	});
});
//烛光效果
var mouse = {
	X: 0,
	Y: 0,
	CX: 0,
	CY: 0
},
block = {
	X: mouse.X,
	Y: mouse.Y,
	CX: mouse.CX,
	CY: mouse.CY
};
$('.show-box').on('mousemove', function(e) {
	mouse.X = (e.pageX - $(this).offset().left) - $('.show-box').width() / 2;
	mouse.Y = (e.pageY - $(this).offset().top) - $('.show-box').height() / 2
});
$('.show-box').on('mouseleave', function(e) {
	mouse.X = mouse.CX;
	mouse.Y = mouse.CY
});
setInterval(function() {
	block.CY += (mouse.Y - block.CY) / 12;
	block.CX += (mouse.X - block.CX) / 12;
	$('.show-box .circleLight').css('background', 'radial-gradient(circle at ' + mouse.X + 'px ' + mouse.Y + 'px, #FEFFFB, transparent)');
	$('.show-box').css('transform','scale(1.03) translate(' + (block.CX * 0.05) + 'px, ' + (block.CY * 0.05) + 'px) rotateX(' + (block.CY * 0.05) + 'deg) rotateY(' + (block.CX * 0.05) + 'deg)')
}, 30);